<!doctype html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>校园心理咨询预约系统--后台登录</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="__ADMIN__/lib/layui/layui.js" charset="utf-8"></script>
    <link rel="stylesheet" href="__ADMIN__/css/font.css">
    <link rel="stylesheet" href="__ADMIN__/css/login.css">
    <link rel="stylesheet" href="__ADMIN__/css/xadmin.css">
    <link rel="shortcut icon" href="__USER__/images/favicon.ico">
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<style>
    .codeInput {
        width: 100px;
        height: 200px;
        font-size: 25px;
        /*验证码样式*/
        font-family: Arial;
        font-style: italic;
        font-weight: bold;
        letter-spacing: 2px;
    }
</style>
<body class="login-bg">

<div class="login layui-anim layui-anim-up">
    <div class="message">校园心理咨询预约系统--后台登录</div>
    <div id="darkbannerwrap"></div>

    <!--    <form action="../Login/check" method="post" class="layui-form">-->
    <input id="name" name="username" placeholder="用户名" type="text" lay-verify="required" class="layui-input">
    <hr class="hr15">
    <input id="password" name="password" lay-verify="required" placeholder="密码" type="password" class="layui-input">
    <hr class="hr15">
    <div style="display:inline">
        <div class="cardDiv">
            <input id="loginCard" style="float:left;width:70%;" class="layui-input cardInput" type="text"
                   name="card" placeholder="输入验证码">
        </div>
        <div class="codeDiv">
            <input id="loginCode" style="float:left;height:50px " class="layui-input codeInput" type="button">
        </div>
    </div>
    <hr class="hr15">
    <input value="登录" id="loginBtn" lay-submit lay-filter="login" style="width:100%;" type="submit">
    <hr class="hr20">
    <!--    </form>-->
</div>

<script>

    //检测预约状态
    $(document).ready(function () {
        $.ajax({
            type: "get",
            url: "{:url('Admin/operastatus')}",
            async: false,
            success: function (data) {
                 //console.log(data);
                // if (data.data = 0) {
                //     count = 0;
                // }
            }
        });
    });


    layui.use(['layer'], function () {
        var layer = layui.layer;
    })
    $(function () {
        // 页面初始化生成验证码
        window.onload = createCode('#loginCode');
        // 验证码切换
        $('#loginCode').click(function () {
            createCode('#loginCode');
        });
        // 登陆事件
        $('#loginBtn').click(function () {
            login();
        });
        // 注册事件
    });

    // 生成验证码
    function createCode(codeID) {
        var code = "";
        // 验证码长度
        var codeLength = 4;
        // 验证码dom元素
        var checkCode = $(codeID);
        // 验证码随机数
        var random = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R',
            'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
        for (var i = 0; i < codeLength; i++) {
            // 随机数索引
            var index = Math.floor(Math.random() * 36);
            code += random[index];
        }
        // 将生成的随机验证码赋值
        checkCode.val(code);
    }

    // 校验验证码、用户名、密码
    function validateCode(inputID, codeID) {
        var inputCode = $(inputID).val().toUpperCase();
        var cardCode = $(codeID).val();
        var loginUsername = $('#name').val();
        var loginPassword = $('#password').val();
        if ($.trim(loginUsername) == '' || $.trim(loginUsername).length <= 0) {
            layer.msg("用户名不能为空");
            return false;
        }
        if ($.trim(loginPassword) == '' || $.trim(loginPassword).length <= 0) {
            layer.msg("密码不能为空");
            return false;
        }
        if (inputCode.length <= 0) {
            layer.msg("验证码不能为空");
            return false;
        }
        if (inputCode != cardCode) {
            layer.msg("请输入正确验证码");
            return false;
        }
        return true;
    }


    function login() {
        if (!validateCode('#loginCard', '#loginCode')) {
            //阻断提示
        } else {
            var loginUsername = $('#name').val();
            var loginPassword = $('#password').val();
            $.ajax({
                url: "../Login/logincheck",
                type: 'POST',
                dataType: "json",
                data: {"name": loginUsername, "password": loginPassword},
                async: false,//必须是同步提交的
                success: function (res) {
                    if (res == 1) {
                        layer.msg("登陆成功！");
                        window.location.href = '../index/index.html';
                    } else if (res == 2) {
                        layer.msg("账号被禁用，请联系超级管理员！");
                    } else if (res == 3) {
                        -
                            layer.msg("密码错误！");
                    } else if (res == 4) {
                        layer.msg("不存在该用户！");
                    }

                },
            });

        }

    }

</script>
</body>
</html>